<template>
	<view class="container">
		<image class="logo" :src="`${url}/images/index/LOGO.png`" mode=""></image>
		<view>
			<view class="title">建企空间站欢迎您</view>
			<view class="tet">一款建筑类的办证教育小程序</view>
		</view>
		<view class="from">
			<!-- 姓名 -->
			<view class="">
				<view class="text">姓名</view>
				<view class="ipt"><input class="uni-input" type="number" placeholder="请输入您正确的姓名" /></view>
			</view>
			<!-- 性别 -->
			<view class="">
				<view class="text">性别</view>
				<view class="ipt"><input class="uni-input" type="number" placeholder="请输入您的性别" /></view>
			</view>
			<!-- 手机号 -->
			<view class="">
				<view class="text">手机号码</view>
				<view class="ipt">
					<input class="uni-input" type="number" placeholder="请输入手机号" />
					<button class="mini-btn" type="primary" size="mini">获取验证码</button>
				</view>
			</view>
			<!-- 验证码 -->
			<view class="">
				<view class="text">验证码</view>
				<view class="ipt"><input class="uni-input" type="number" placeholder="请输入验证码" /></view>
			</view>
		</view>
		<button type="primary" class="btn">立即验证</button>
	</view>
</template>

<script>
export default {
	data() {
		return {
			url: this.baseUrl
		};
	},
	methods: {}
};
</script>

<style>
.container {
	padding: 20upx 50upx;
}
.logo {
	width: 140upx;
	height: 140upx;
	margin: 20upx 0;
}
.title {
	font-size: 38upx;
	font-weight: 600;
	color: #090909;
}
.tet {
	font-size: 24upx;
	color: #cbcbcb;
	line-height: 60upx;
}
.from {
	margin-top: 40upx;
}
.text {
	font-weight: 600;
	font-size: 28upx;
	margin-top: 20upx;
}
.ipt {
	border-bottom: 1px solid #dcdcdc !important;
	position: relative;
}
.uni-input {
	height: 80upx;
	margin: 20upx 0 0 20upx;
	color: #57ba96;
}
.mini-btn {
	position: absolute;
	right: 20upx;
	top: 0upx;
	background-color: #159d6b !important;
}
.btn {
	margin-top: 40upx;
	width: 100%;
	background-color: #159d6b !important;
}
input{
	font-size: 26upx;
	color: #E2E2E2;
}
</style>
